<script>
import mixinApp from '@/mixins/mixinApp'
import mixinTags from '@/mixins/mixinTags'
import mixinExternal from '@/mixins/mixinExternal'

export default {
  name: 'RouteView',
  mixins: [mixinApp, mixinTags, mixinExternal],
  computed: {
    /**
     * @description 启用缓存
     * @returns {Boolean}
     */
    isKeepAlive () {
      const multiTab = this.multiTab
      const keepAlive = this.keepAlive
      const isEnvProd = process.env.NODE_ENV === 'production' // Issues: https://github.com/vuejs/vue-cli/issues/5008
      return multiTab && keepAlive && isEnvProd
    },
    /**
     * @description 路由标识
     * @returns {String}
     */
    key () {
      const route = this.$route
      const meta = route.meta || {}
      const match = meta.match || 'path'
      const isExternal = match === 'external'
      const external = this.getExternal(route)
      return !isExternal ? route.fullPath : external
    }
  },
  render () {
    const key = this.key
    const cachedTags = this.cachedTags
    const isKeepAlive = this.isKeepAlive

    if (isKeepAlive) {
      return (
        <div class="route-view-container">
          <keep-alive include={cachedTags}>
            <router-view key={key} />
          </keep-alive>
        </div>
      )
    }
    return (
      <div class="route-view-container">
        <router-view />
      </div>
    )
  }
}
</script>
